<template>
  <h1>甄选列表页面</h1>
  <button @click="query">查询</button>
  <button @click="delete1(1070096)">删除</button>
  <el-table :data="tableData" style="width: 100%">
    <el-table-column fixed prop="communityId" label="communityId" width="150" />
    <el-table-column prop="communityName" label="communityName" width="220" />
    <el-table-column prop="communityDistrict" label="communityDistrict" width="220" />
    <el-table-column fixed="right" label="Operations" width="220">
      <template v-slot="scope">
        <el-button link type="primary" size="small" @click="handleClick(scope.row)">删除</el-button>
        <el-button link type="primary" size="small" @click="handleEdit(scope.row)">修改</el-button>
      </template>
    </el-table-column>
  </el-table>
  <div>{{ counter.count }}</div>
  <div @click="counter.increment()">increment</div>
</template>
<script setup>
import { ref, onMounted } from 'vue'
import axios from 'axios'
import { useCounterStore } from '@/stores/counter'
var counter = useCounterStore()
const tableData = ref([])
//生命周期函数，页面加载完毕自动调用
onMounted(() => {
  query()
})

const query = async () => {
  // const response = await axios.get(
  //   'http://43.143.190.87:8091/panghudaojiaBackend/community/communityList?name=dongshima',
  // )
  const response = await axios.get(
    'http://43.143.190.87:8091/panghudaojiaBackend/community/communityList',
    {
      params: {
        id: 123,
        name: 'xishima',
      },
    },
  )
  console.log(response.data.data.list)
  tableData.value = response.data.data.list
}

const delete1 = async (id) => {
  console.log(id)
  const response = await axios.post(
    'http://43.143.190.87:8091/panghudaojiaBackend/community/communityRemove',
    {
      communityId: id,
    },
  )
  console.log(response.data)
  if (response.data.status == 200) {
    alert('删除成功')
    //发起网路请求，查询最新数据
    query()
  } else {
    alert('删除失败')
  }
}

const handleClick = (row) => {
  console.log('click')
  console.log(row)
}

const handleEdit = (row) => {
  console.log(row.communityId)
}
</script>
<style></style>
